<template>
	<view v-if="showSubmit">
		<view class="submit-pop-box">
			<view class="submit-pop-info">
				<view class="submit-pop-title">提示</view>
				<view class="line"></view>
				<view class="submit-pop-info-text">是否要扣减 <text>{{tolIntegral}}</text> 积分 来兑换商品</view>
				<view class="submit-pop-button">
					<view @click="toCancel()" class="cancel-pop-button-text">取消</view>
					<view  @click="toOk()" class="submit-pop-button-text">确认兑换</view>
				</view>
			</view>
		</view>
		<view class="mask"></view>
	</view>
</template>
<script>
	export default {
		name:"SubmitPop",
		props:{
			showSubmit: {
				type: Boolean,
				default: false
			},
			tolIntegral: {
				type: Number,
				default: 0
			},
		},
		data() {
			return {
			};
		},
		created() {
		},
		methods:{
			// 关闭弹窗
			toCancel(){
				console.log(111)
				this.$emit('toClose', {})
			},
			// 点击确认
			toOk(){
				this.$emit('selectOk', {})
			}
		}
	}
</script>

<style>
   .mask{
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100vw;
	   height: 100vh;
	   background-color: rgba(0, 0, 0, 0.5);
	   z-index: 11;
   }
   .submit-pop-box{
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100vw;
	   height: 100vh;
	   z-index: 12;
	   display: flex;
	   flex-direction: column;
	   justify-content: center;
	   align-items: center;
   }
   .line{
	   width: 570rpx;
	   height: 1rpx;
	   background: #D8D8D8;
   }
   .submit-pop-info{
	   width: 630rpx;
	   height: 502rpx;
	   background: #FFFFFF;
	   border-radius: 24rpx;
	   backdrop-filter: blur(15px);
	   display: flex;
	   flex-direction: column;
	   align-items: center;
	   justify-content: space-between;
	   padding: 50rpx;
   }
   .submit-pop-title{
	   height: 48rpx;
	   font-size: 42rpx;
	   text-align: center;
	   font-family: PingFangSC-Semibold, PingFang SC;
	   font-weight: 600;
	   color: #333333;
	   line-height: 48rpx;
	   letter-spacing: 1px;
   }
   .submit-pop-info-text{
	   height: 132rpx;
	   font-size: 46rpx;
	   font-family: PingFangSC-Regular, PingFang SC;
	   font-weight: 400;
	   color: #333333;
	   line-height: 66rpx;
	   text-align: center;
   }
   .submit-pop-info-text text{
	   color: #FF9500;
	   padding: 0 8rpx;
   }
   .submit-pop-button{
	   width: 100%;
	   display: flex;
	   justify-content: space-between;
	}
	.cancel-pop-button-text{
		width: 245rpx;
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
		border-radius: 44rpx;
		border: 2rpx solid #4CBB72;
		font-size: 42rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #4CBB71;
	}
   .submit-pop-button-text{
	   width: 245rpx;
	   height: 90rpx;
	   line-height: 90rpx;
	   text-align: center;
	   background: #4CBB72;
	   border-radius: 44rpx;
	   font-size: 42rpx;
	   font-family: PingFangSC-Medium, PingFang SC;
	   font-weight: 500;
	   color: #FFFFFF;
   }
   .count-icon{
	   width: 76upx;
	   height: 76upx;
	   box-sizing: border-box;
	   border: 4upx solid #fff;
	   display: flex;
	   align-items: center;
	   justify-content: center;
	   border-radius: 50%;
	   margin-top: 30rpx;
   }
   
</style>
